草庐IT

ionic 浮动框

全部标签

javascript - 访问 Ionic 2 DOM 元素的样式

我正在尝试使用以下内容访问我的其中一个页面的DOM元素:ionViewDidEnter(){this.platform.ready().then(()=>{letelm=document.querySelector("ion-navbar.toolbar.toolbar-ios.statusbar-padding");console.log(elm.style);})}但是,这个元素似乎没有样式-我尝试了各种组合来访问它,但没有成功。具体来说,我正在寻找ion-navbar的高度。这可能吗? 最佳答案 你可以通过element.of

html - 如何让左浮动的 div 占用 100% 的剩余空间?

如果我有一个宽度为75%的容器,里面有左右两列,左边的宽度为10em,我如何让右边的容器占用100%的剩余空间?我试过了,但没有成功:html,body{margin:0;padding:0;width:100%;height:100%;}#container{position:relative;width:75%;margin:0auto;background:blue;}#left-container{position:relative;float:left;height:100%;width:10em;background:red;}#right-container{positi

html - 用自定义颜色覆盖 Ionic Header

是否可以使用ionic自定义标题的颜色?通过自定义,我的意思是使用自定义颜色,而不是定义的bar-something之一。这个我试过了,但是好像不行在CSS中:.custom-dark{color:#30393A;}HereisacodePen我好像不能改变蓝色。 最佳答案 您可以使用SASS来做到这一点。如果您还没有输入终端$ionicsetupsass然后您可以在scss/目录中使用覆盖。$light:#fff!default;$stable:#f8f8f8!default;$positive:#387ef5!default;$

html - ionic 2如何返回上一界面

在ionicq中,我们将使用$ionichistory.goback()返回上一屏幕。但是在ionic2中,我们如何才能做到这一点。我尝试单击此按钮以打印控制台消息。但它不起作用。CANCEL.jsgoback(){console.log('ClickonbuttonTestConsoleLog');}请帮帮我。我有两个屏幕。当我从第一个屏幕转到下一个屏幕时。在下一个屏幕中,我有一个按钮叫回。当我按下它时,我应该回到第一个屏幕。如何做到这一点?我的完整代码:html:CANCELLOGINSAVE我的.js:import{Component}from'@angular/core';im

html - Ionic 2 占位符文本样式

我正在使用Ionic2rc0开发一个应用程序,整个应用程序中有几个输入字段仍然需要样式。Yournameionic2输入APIhttp://ionicframework.com/docs/v2/api/components/input/Input/具体来说,我需要更改占位符文本的样式,以及激活时的底部边框。通过API和提供的SASS变量覆盖,我无法弄清楚如何覆盖输入字段的边框和占位符文本的继承样式。除了影响每个输入所在的特定页面的这些更改之外,我想避免使用“!重要”(我不希望更改是“全局”)。 最佳答案 使用Ionic2RC4,您必

css - Ionic TextAreas 变得太大

我在ionic-framework-project中有一些嵌套在列表中的文本区域。文本区域未完全显示。它的一部分超出了屏幕。Description发生的事情是文本区域的宽度变得太大,span.width+textarea.width>100%。如果我手动将文本区域的宽度设置得小一点,它会显示为100%。我将它的父级的最大宽度设置为100%,因此它不应该变大,但它变大了。如何防止这种行为并让文本区域不超过屏幕。 最佳答案 Description试试这个。使用“col”属性限制文本区域。 关

html - Ionic - 在另一个 View 上刷新时不应用 CSS

我目前正在开发我的第一个Ionic应用程序,并且是第一次使用Angular。我正在使用pie-chartlibrary在应用程序的仪表板上显示图表。如果我在仪表板上刷新时效果很好,看起来像这样:https://imgur.com/YUCAO6i,oakGp8c#1但是如果我导航到另一个选项卡,比方说服务器选项卡,并在那里刷新,则宽度和高度不会应用于仪表板上的图表。相反,它们使用标准宽度和高度(500hx900w而不是100hx100w)呈现。(见imgur上的第二张图片)。如果我再次刷新仪表板,它们将正常呈现。我查看了库的源代码,看到在仪表盘上刷新时,element[0].parent

javascript - 如何在 Ionic Framework 中进行选项卡式页面之间的转换

在IonicFramework中,您可以设置选项卡。选项卡内的页面可以使用slide-left-right或其他类型的转换轻松转换。这使应用程序感觉流畅且经过深思熟虑。我遇到的问题是与每个选项卡关联的页面,一旦从选项卡菜单中单击,根本不会转换,只有boom:一个页面。我在codepen上找到了一支笔(linktocodependemo)可以按照我的意愿(在某种程度上)复制这种效果,但我无法在任何情况下复制它,更不用说Ionicrc0(1.0)版本了。codepen代码使用的动画似乎在其他地方不起作用:请协助。 最佳答案 我还没有尝试

html - 专注于手机输入时无法滚动到 ionic 应用程序中输入

预定义的手机功能:当我们关注任何输入时,它会自动滚动到移动设备中的该输入。问题:它在我的ionic应用程序中不起作用,因为水平滚动也在那里,所以当我在移动设备中单击输入时,它不会自动滚动到该输入并且输入隐藏在键盘。我已经为此尝试了delegate-handle,但它不起作用。Plunker同样的HTMLController$ionicScrollDelegate.$getByHandle('nomineeDiv').scrollBy(580,140,true); 最佳答案 Solution.1你能尝试创建一个双击事件来改变表单的位置

css - 在特定子页面上隐藏 Ionic TabBar (IONIC 3)

我想在多个特定页面上隐藏我的标签栏。我主要关注的是将它隐藏在我的登录页面、注册页面和评论页面上。我试过tabsHideOnSubPages:true,但是当我这样做时我的UserProfile页面(这是一个子页面)隐藏标签栏。选项卡栏也必须在UserProfile页面上可见,但在我之前提到的子页面(登录、注册等)上也不可见。我目前正在使用Ionic框架:ionic-angular3.2.0有谁知道我该如何解决这个问题? 最佳答案 我可以为您提供快速修补程序。将此代码复制到您的.ts页面文件中。该函数将在页面加载时执行。如果你想隐藏标